<template>
  <sn-three-col-space>
    <div slot="spaceContent" class="margin-top">
      <cinema-search
          @searchByCinemaName="searchByCinemaName"
          @toSearchSingle="searchSingle"
          @toSearchAll="searchAll"/>
      <cinema-list ref="cinemaList" class="cinema-list"/>
    </div>
  </sn-three-col-space>
</template>

<script>
import CinemaSearch from "@/views/cinema/cinema_search/CinemaSearch";
import CinemaList from "@/views/cinema/cinema_list/CinemaList";

export default {
  name: "Cinema",
  components: {
    CinemaSearch,
    CinemaList,
  },
  mounted() {
    this.searchAll()
  },
  methods: {
    //根据电影名称查询
    searchByCinemaName(cinemaName) {
      let cinemaList = this.$refs.cinemaList
      this.$set(cinemaList.searchParams, 'cinemaName', cinemaName)
      cinemaList.getDataList()
    },
    //查所有
    searchAll(description) {
      //获取子组件
      let cinemaList = this.$refs.cinemaList
      switch (description) {
        case '品牌':
          this.$set(cinemaList.searchParams, 'brandName', '')
          break
        case '行政区':
          this.$set(cinemaList.searchParams, 'areaName', '')
          break
        case '特殊厅':
          this.$set(cinemaList.searchParams, 'movieHallTypeName', '')
          break
        case '服务':
          this.$set(cinemaList.searchParams, 'servieName', '')
          break
      }
      cinemaList.getDataList()
    },
    //查单个
    searchSingle(condition) {
      //获取子组件
      let cinemaList = this.$refs.cinemaList
      //对象解构 获取查询条件
      let {id, name, description} = condition
      switch (description) {
        case '品牌':
          this.$set(cinemaList.searchParams, 'brandName', name)
          break
        case '行政区':
          this.$set(cinemaList.searchParams, 'areaName', name)
          break
        case '特殊厅':
          this.$set(cinemaList.searchParams, 'movieHallTypeName', name)
          break
        case '服务':
          this.$set(cinemaList.searchParams, 'servieName', name)
          break
      }
      cinemaList.getDataList()
    }
  },
}
</script>

<style scoped>
.cinema-list {
  margin-top: 35px;
}
</style>